import 'package:syria_sports/presentation/players/public_player_profile_page/widgets/level_view.dart';
import 'package:syria_sports/widgets/app_bar/outline_icon_button.dart';
import '../../../data/models/auth/user.dart';
import '../../../widgets/info_view_widget.dart';
import '../add_player_page/widgets/my_circle_avatar.dart';
import 'bloc/player_profile_bloc.dart';
import 'package:flutter/material.dart';
import 'package:syria_sports/core/app_export.dart';
import 'package:syria_sports/widgets/app_bar/appbar_subtitle.dart';
import 'package:syria_sports/widgets/app_bar/custom_app_bar.dart';

class PlayerProfileScreen extends StatelessWidget {
  const PlayerProfileScreen({Key? key}) : super(key: key);

  static Widget builder({required BuildContext context,required User user}) {
    return BlocProvider<ProfileBloc>(
        create: (context) =>
            ProfileBloc(
                ProfileState(user: user),
            )..add(ProfileInitialEvent(user: user)),
        child: const PlayerProfileScreen());
  }

  @override
  Widget build(BuildContext context) {
    mediaQueryData = MediaQuery.of(context);
    return BlocBuilder<ProfileBloc, ProfileState>(builder: (context, state) {
      User user = state.user??User.empty();

      return SafeArea(
          child: Scaffold(
              appBar: _buildAppBar(context , user ,BlocProvider.of(context)),
              body: SingleChildScrollView(
                child: Container(
                    width: double.maxFinite,
                    padding: EdgeInsets.symmetric(vertical: 36.v),
                    child: Column(
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          MyCircleAvatar(
                            width: 65,
                            imageURL:user.image ,
                            borderColor: Colors.grey,
                            backgroundColor: Colors.black,
                            activeIconWidth: 32,
                          ),
                          Padding(
                              padding: EdgeInsets.only(top: 9.v, bottom: 14.v),
                              child: Column(children: [
                                Text(user.fullName,
                                    style: theme.textTheme.titleSmall),
                              ])),

                          Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text('تقييم اللاعب',
                                    style: theme.textTheme.titleLarge),
                                Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 32.0),
                                  child: Text('${user.userRate.toStringAsFixed(2)}%',
                                      style: theme.textTheme.titleLarge),
                                ),

                              ],
                            ),
                          ),
                          InfoViewWidget(
                            value: true,
                            title: 'تفاصيل التقييم',
                            children: [
                              Padding(
                                  padding: EdgeInsets.only(left: 16.h),
                                  child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                                      crossAxisAlignment: CrossAxisAlignment.center,
                                      children: [
                                        Column(
                                          children: [
                                            Row(
                                              crossAxisAlignment: CrossAxisAlignment.end,
                                              children: [
                                                Text(user.commitment??"",
                                                    style: theme.textTheme.titleMedium),
                                                Text("%".tr,
                                                    style: theme.textTheme.bodySmall),
                                              ],
                                            ),
                                            const SizedBox(height: 4,),
                                            Text("الالتزام",
                                                style: theme.textTheme.titleSmall),
                                          ],
                                        ),
                                        Container(color: Colors.grey,height: 45,width: 1,),
                                        Column(
                                          children: [
                                            Row(
                                              crossAxisAlignment: CrossAxisAlignment.end,
                                              children: [
                                                Text(user.agility??"",
                                                    style: theme.textTheme.titleMedium),
                                                Text("%".tr,
                                                    style: theme.textTheme.bodySmall),
                                              ],
                                            ),
                                            const SizedBox(height: 4,),
                                            Text("المرونة".tr,
                                                style: theme.textTheme.titleSmall),
                                          ],
                                        ),
                                        Container(color: Colors.grey,height: 45,width: 1,),
                                        Column(
                                          children: [
                                            Row(
                                              crossAxisAlignment: CrossAxisAlignment.end,
                                              children: [
                                                Text(user.power??"",
                                                    style: theme.textTheme.titleMedium),
                                                Text("%",
                                                    style: theme.textTheme.bodySmall),
                                              ],
                                            ),
                                            const SizedBox(height: 4,),
                                            Text("القوة",
                                                style: theme.textTheme.titleSmall),
                                          ],
                                        ),

                                      ])),
                              const Padding(
                                padding: EdgeInsets.all(32.0),
                                child: Divider(color: Colors.red),
                              ),
                            ],
                          ),

                          Padding(
                            padding: const EdgeInsets.all(8.0),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text('مستوى اللاعب',
                                    style: theme.textTheme.titleLarge),
                                Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 32.0),
                                  child: Text('level ${user.level??""}',
                                      style: theme.textTheme.titleLarge),
                                ),

                              ],
                            ),
                          ),
                          const Padding(
                            padding: EdgeInsets.all(8.0),
                            child: Divider(color: Colors.white54),
                          ),
                        ])),
              ),
          ),
      );
    });
  }

  /// Section Widget
  PreferredSizeWidget _buildAppBar(BuildContext context, User user , ProfileBloc cubit) {

    return CustomAppBar(
        leading: OutlineIconButton(
          imagePath: ImageConstant.imgRightIcon,
          onTapped: (){
            Navigator.pop(context);
          },
        ),
        title: AppbarSubtitle(
            text: "ملف اللاعب".tr, margin: EdgeInsets.only(left: 12.h),
        ),
    );
  }


}
